<template>
	<div>
		<h1 class="title">管理员登录系统</h1>
		<el-form :model="wyform" ref="formObj" :rules="rules" style="margin-top: 50px; padding:0 50px;" label-width="100px">
			<el-form-item label="手机号码" prop="phone">
				<el-input v-model="wyform.phone" placeholder="请输入手机号/电子邮箱"></el-input>
			</el-form-item>
			<el-form-item label="密码" prop="password">
				<el-input v-model="wyform.password" placeholder="请输入密码" show-password></el-input>
			</el-form-item>
			<el-form-item label-width="0">
				<el-button style="width: 80%; margin-left: 98px;" plain type="primary" @click="login">登录</el-button>
			</el-form-item>
			<el-form-item label-width="0">
				<el-link style="position: absolute; right: 0; top: 10px;" :underline="false"  @click="find">忘记密码</el-link>
			</el-form-item>
		</el-form>
	</div>
</template>

<script setup>
	import VueCookie from 'vue-cookie';
    import { post } from '@/plugins/axios'
	import { ref,reactive } from 'vue'
	import router from '@/router'
	import { userMenuStore } from '@/stores'
	const menuStore = userMenuStore()
	const emits = defineEmits('update:r')
	const wyform = reactive({
		phone: '',
		password: '',
		
	})
	const formObj = ref()
	const rules = reactive({
		phone:[
			{ required: true,message:'请输入手机号/电子信箱',trigger: 'blur'}
		],
		password:[
			{ required: true,message:'请输入密码',trigger: 'blur'}
		]
	})
	function find(){
		emits('update:r','180deg')
	}
	function login(){
		post('/tUser/Buslogin',wyform,content => {
			menuStore.setMenu(content.menu)
			console.dir(content)
			VueCookie.set('token',content.token,{ expires: '1D' })
			router.push({
				path: '/index'
			})
			console.dir(content)
		},formObj)
	}
</script>

<style scoped lang="scss">
	.title{
		text-align: center;
		margin-top: 20px;
		letter-spacing: 2rem;
	}
</style>